<template>
  <div class="container">
    <el-dialog
      title="添加税票"
      :visible.sync="taxDialogs.centerDialogVisible"
      width="50%"
      center
      :lock-scroll="true"
      @open="getData"
      @close="hideDialog"
    >
      <el-form
        ref="form"
        :rules="rules"
        :model="formData"
        label-width="80px"
        label-position="left"
        class="top"
      >
        <!-- <el-form-item label="抬头：" >
          <el-input v-model="formData.name" placeholder="请输入抬头" />
        </el-form-item>
        <el-form-item label="税号：" >
          <el-input v-model="formData.number" placeholder="请输入税号" />
        </el-form-item>-->
        <el-form-item label="金额:" prop="sum">
          <el-input-number
            :controls="false"
            v-model="formData.sum"
            controls-position="right"
            placeholder="请输入金额"
            @change="proce"
          ></el-input-number>
        </el-form-item>
        <el-form-item style="width:300px;margin-left:20px;" label="毛重:">
          <el-input v-model="weight"  :disabled="true" />
        </el-form-item>
        <el-form-item style="width:300px;margin-left:20px;" label="平均金额:">
          <el-input v-model="purchase_price"  :disabled="true" />
        </el-form-item>
      </el-form>
      <el-table
        :data="tableData"
        border
        style="width: 100%"
        empty-text="暂无数据"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="50" align="center"></el-table-column>
        <el-table-column prop="goods_name" label="商品名称" align="center"></el-table-column>
        <el-table-column prop="serial_code" label="结算单号" align="center"></el-table-column>
        <el-table-column prop="goods_num" label="毛重" align="center"></el-table-column>
        <el-table-column prop="goods_price" label="单价" align="center"></el-table-column
        <el-table-column prop="unit" label="单位" align="center"></el-table-column>
        <el-table-column prop="amount" label="总价" align="center"></el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
        <el-button @click="cancel">取 消</el-button>
        <el-button type="primary" @click="confirm()">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { addInvoice, getStatements } from "@/api/supplier/supplierList";
export default {
  props: {
    taxDialogs: Object
  },
  data() {
    return {
      formData: {
        name: "",
        number: "",
        sum: ""
      },
      rules: {
        // name: [{ required: true, message: "填写抬头", trigger: "blur" }],
        // number: [{ required: true, message: "填写税号", trigger: "blur" }],
        sum: [{ required: true, message: "填写金额", trigger: "blur" }]
      },
      tableData: [],
      goodsArrId: [],
      price: 0,
      weight: 0,
      purchase_price: 0
    };
  },
  methods: {
    //关闭
    hideDialog() {
      this.taxDialogs.centerDialogVisible = false;
      this.$refs["form"].resetFields();
    },
    //获取商品数据
    getData() {
      let data = {
        supplier_id: this.taxDialogs.id,
      };
      getStatements(data).then(res => {
        this.tableData = res.data.data;
      });
    },
    //提交
    confirm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.formData.sum != this.price) {
            this.$confirm("商品总价和填写的税票价格不相同, 是否继续?", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            })
              .then(() => {
                let data = {
                  amount: this.formData.sum,
                  supplier_id: this.taxDialogs.id,
                  statement_ids: this.goodsArrId.join(",")
                };
                addInvoice(data)
                  .then(res => {
                    if (res.code == 0) {
                      this.$message({
                        message: res.message || res.msg,
                        type: "success"
                      });
                      this.hideDialog();
                      this.$emit("upData");
                    } else {
                      this.$message({
                        message: res.message || res.msg,
                        type: "error"
                      });
                    }
                  })
                  .catch(res => {
                    console.log(res);
                  });
              })
              .catch(() => {
                this.$message({
                  type: "info",
                  message: "已取消删除"
                });
              });
          } else {
            let data = {
              amount: this.formData.sum,
              supplier_id: this.taxDialogs.id,
              statement_ids: this.goodsArrId.join(",")
            };
            addInvoice(data)
              .then(res => {
                if (res.code == 0) {
                  this.$message({
                    message: res.message || res.msg,
                    type: "success"
                  });
                  this.hideDialog();
                  this.$emit("upData");
                } else {
                  this.$message({
                    message: res.message || res.msg,
                    type: "error"
                  });
                }
              })
              .catch(res => {
                console.log(res);
              });
          }
        }
      });
    },
    proce(){
      if(this.formData.sum == 0 || this.weight==0 || this.formData.sum=='' || this.formData.sum==undefined){
         this.purchase_price = 0;
      }else{
         this.purchase_price =(this.formData.sum / this.weight
      ).toFixed(4);
      }
    },
    //获取商品id和商品的总价
    handleSelectionChange(e) {
      this.price = 0;
      this.weight = 0;
      let sum = 0;
      this.goodsArrId = [];
      e.forEach(res => {
        this.price += parseFloat(res.amount);
        this.goodsArrId.push(res.id);
        sum += parseFloat(res.goods_num);
      });
      this.weight = sum.toFixed(4);
      this.purchase_price = (this.weight == 0 || this.formData.sum == 0
        ? 0
        : this.formData.sum / this.weight
      ).toFixed(4);
    },
    //取消
    cancel() {
      this.hideDialog();
    }
  }
};
</script>
<style scoped>
.top {
  display: flex;
}
</style>